<template>
	<view>
		<view class="header" :style="{ 'height': statusBarHeight + 'px' }">
			<view class="navon" :style="{ 'height': statusBarHeight + 'px', 'padding-top': statusBarHeight1 + 'px' }">
				<view class="header-back" @click="goBack">
					<i class="iconfont" style="font-size: 20px;">&#xe605</i>
				</view>
			</view>
		</view>
		<view class="app-content">
			<view class="swiper">
				<swiper class="swiper" @change="bannerChange" indicator-active-color="#FFFFFF" :circular="true"
					:autoplay="true" :indicator-dots="false">
					<swiper-item>
						<image @click="previewImage(rq.imgUrl(userInfo.breviary_image))"
							:src="rq.imgUrl(userInfo.breviary_image)" mode="aspectFill" class="syimg1"></image>
						<image v-if="userInfo.video_files" src="https://pw.qyang.cc/static/svg/playVideo.svg"
							@click="previewImage()" mode="aspectFill" class="playIcon"></image>
					</swiper-item>
					<swiper-item v-for="(item, index) in bannerList" :key="index">
						<image @click="previewImage(rq.imgUrl(item))" :src="rq.imgUrl(item)" mode="aspectFill"
							class="syimg1"></image>
					</swiper-item>
				</swiper>
				<view class="bannerNum">
					<text>{{ currentBanner + 1 }}</text>/{{ bannerList.length + 1 }}
				</view>
			</view>
			<view class="title">
				<view class="con1">
					<view class="tab1">
						<image class="avator" :src="rq.imgUrl(userInfo.avatar)" mode="aspectFill"></image>
					</view>
					<view class="juli">
						<view
							style="background: #00BC56;width: 10rpx;height: 10rpx;border-radius: 50%;margin-right: 10rpx;">
						</view>
						<span v-if="userInfo.distance">{{ userInfo.distance }}km</span>
						<span v-else>暂无定位</span>
					</view>
					<view class="tab2">
						<view class="tabs" v-for="(item, index) in userInfo.icon" :key="index">
							<image class="img" :src="rq.imgUrl(item.image)" mode="scaleToFill"></image>
							<span>{{ item.title }}</span>
						</view>
					</view>
				</view>
				<view class="con2">
					<view class="l1"> {{ userInfo.nickname ? userInfo.nickname : '' }}
						<image @click="isRealTip = true" v-if="userInfo.is_real"
							src="https://pw.qyang.cc/static/svg/icon-realname.svg"
							style="width: 30rpx;height: 30rpx;margin: 0 20rpx;">
						</image>
						<view class="l1-sex1" v-if="userInfo.gender == 1">
							<image src="https://pw.qyang.cc/static/sexW.png"
								style="width: 20rpx;height: 20rpx;margin-right: 10rpx;">
							</image>{{ userInfo.age ? userInfo.age : '--' }}
						</view>
						<view class="l1-sex2" v-else>
							<image src="https://pw.qyang.cc/static/sexM.png"
								style="width: 20rpx;height: 20rpx; margin-right: 10rpx;">
							</image>{{ userInfo.age ? userInfo.age : '--' }}
						</view>
						<image :src="rq.imgUrl(userInfo.level_info?userInfo.level_info.logo:'')" v-if="userInfo.level > 0"
							style="width: 52px;height: 28px;margin: 0 20rpx;">
						</image>
						<!-- #ifndef H5 -->
						<button open-type="share" class="share" @click.stop="handleShare(item)"
							style="width: 18px;height: 18px;margin: 0 20rpx;right: 0;position: absolute;display: flex;align-items: center;justify-content: center;">
							<image src="https://pw.qyang.cc/static/svg/icon-share1.svg"
								style="width: 16px;height: 16px;"></image>
						</button>
						<!-- #endif -->
					</view>

				</view>
				<view class="con3">
					<view class="l1">
						<view class="id">
							ID:{{ userInfo.id ? userInfo.id : '' }}
						</view>
						<view class="info">
							<span v-if="userInfo.cm">{{ userInfo.cm }}cm</span>
							<span v-if="userInfo.kg">{{ userInfo.kg }}kg</span>
							<span v-if="userInfo.occupation">{{ userInfo.occupation }}</span>
						</view>
					</view>
					<view class="l2">
						{{ userInfo.pingfen }}
						<image @click="showScoreTip()" src="https://pw.qyang.cc/static/icon-tip.png" mode=""></image>
					</view>
				</view>
				<view class="con4">
					<view v-if="userInfo.ptpj" class="l1">
						<span
							style="font-size: 14px;color: #FF6C91;letter-spacing: 0px;margin-right: 10rpx;">Miss:</span>{{ userInfo.ptpj }}
					</view>
					<view v-else class="l2">{{ userInfo.bio }}</view>
				</view>
				<view class="con5">
					<view class="l1">
						{{ userInfo.zan }}<span class="text">点赞数</span>
					</view><u-line direction="col" length="50%"></u-line>
					<view class="l1">
						<!-- {{ userInfo.completion_rate }}%<span class="text">完成率</span> -->
						{{ userInfo.applause_rate }}<span class="text">发帖数</span>
					</view><u-line direction="col" length="50%"></u-line>
					<view class="l1">
						{{ userInfo.completion_rate }}%<span class="text">完成率</span>
					</view>
				</view>
			</view>
			<view class="tab">
				<u-tabs @click="click" :current='currentIndex' :list="tablist1" lineWidth="20" lineColor="#f56c6c"
					:activeStyle="{
			color: '#303133',
			fontWeight: 'bold',
			transform: 'scale(1.2)'
		}" :inactiveStyle="{
			color: '#606266',
			transform: 'scale(1)'
		}" itemStyle="padding-left: 15px; padding-right: 15px; height: 34px;">
				</u-tabs>
			</view>

			<view class="cbody1" v-if="showInfo">
				<view class="body bq">
					<view class="title-name">
						个人标签
					</view>
					<view class="con">
						<view class="tabs">
							<view class="tabs-item" v-for="i in darenInfo.tags_arr" :key="i.id" :style="'background: ' + i.color">
								{{ i.name }}
							</view>
						</view>
					</view>
				</view>
				<view class="body fw">
					<view class="title-name">
						代表服务
					</view>
					<view class="con">
						<view class="fuwu" v-for="(item, index) in fuwulist" :key="index">
							<image :src="rq.imgUrl(item.image)" mode=""></image>
							<view>{{ item.name }}</view>
						</view>
					</view>
				</view>
				<view class="body pj">
					<view class="title-name">
						TA的评价
					</view>
					<view class="con">
						<view class="com1">
							<view class="l1">
								<view class="text" style="font-size: 28rpx;margin-bottom: 30rpx;">
									综合评分
								</view>
								<view class="score">
									{{ darenInfo.pingfen }} <span class="fen">分</span>
								</view>
							</view>
							<view class="l2">
								<view class="text" v-for="(item, index) in darenInfo.xing_array" :key="index">
									{{ item.name }} <u-rate readonly v-model="item.xing"></u-rate>
								</view>
							</view>
						</view>
						<view class="com2">
							<view class="tab" v-for="(item, index) in darenInfo.order_tag_array" :key="index">
								{{ item.name }}&nbsp;&nbsp;{{ item.count }}
							</view>
						</view>
					</view>
				</view>
			</view>
			<view class="cbody2" v-else>
				<view class="dynamicList" v-for="(item, index) in dynamicList" :key="index"
					@click="goPage('detail', item)">
					<!-- 	<view class="left">
							<image :src="rq.imgUrl(item.user.avatar)" mode="scaleToFill"></image>
						</view> -->
					<view class="left">
						<view class="day">
							{{ item.createtime.split(" ")[0].split("-")[2] }}
						</view>
						<view class="year">
							{{ item.createtime.split(" ")[0].split("-")[0] }}
						</view>
						<view class="year">
							{{ item.createtime.split(" ")[0].split("-")[1] }}
						</view>
					</view>
					<view class="right">
						<view class="r1">
							<view class="fenlei">
								<view class="fenlei1">
									{{ item.category.name }}
								</view>
							</view>
							<view class="status" v-if="item.status != 1" @click.stop="showDeclare(item)">
								已下架
							</view>

						</view>

						<view class="r4">
							<span v-html="showContent(item.content)"></span>
							<view v-if="item.content.length > maxShowLength" class="expand-btn"
								@tap="toggleExpand(item, index)">
								{{ item.isExpanded ? '收起' : '展开' }}
							</view>
						</view>

						<view class="r5" v-if="item.image.length">
							<view class="image" v-for="(media, index) in item.image" :key="index"
								@click.stop="previewMedia(item, index)">
								<video v-if="media.includes('.mp4')" autoplay muted :loop="true"
									style="width: 86px;height: 86px;"></video>
								<image v-else :src="media" mode="" style="width: 86px;height: 86px;">
								</image>
							</view>
						</view>
						<view :class="a.type === 0 ? 'r6' : 'r7'" v-for="a, b in item.activity" :key="b">
							<image
								:src="a.type === 0 ? 'https://pw.qyang.cc/static/icon2.png' : 'https://pw.qyang.cc/static/svg/xin.svg'"
								mode="aspectFit">
							</image>
							{{ a.name }}
						</view>
						<view class="r10" v-if="item.activity && item.activity.length > 2">
							<u-icon name="arrow-down" size="12" color="#000000"></u-icon>
						</view>
						<view class="r9" v-if="item.location" @click.stop>
							<image src="https://pw.qyang.cc/static/svg/dingwei.svg" mode="aspectFit">
							</image>
							{{ item.location }}
						</view>
						<view class="r8" @click.stop>
							<view class="image" @click.stop="handleZan(item, index)">
								<image
									:src="item.is_upvote === 1 ? 'https://pw.qyang.cc/static/is_upvote.png' : 'https://pw.qyang.cc/static/black-xin.png'"
									mode="aspectFit"></image>
								{{ item.upvote_num }}
							</view>
							<!-- &nbsp;&nbsp; -->
							<view class="image" @click.stop="handleCang(item, index)">
								<image
									:src="item.is_collect === 1 ? 'https://pw.qyang.cc/static/is_collect.png' : 'https://pw.qyang.cc/static/black-shoucang.png'"
									mode="aspectFit"></image>
								{{ item.collect_num }}&nbsp;&nbsp;
							</view>
							<view class="image" @click.stop="handleCommont(item)">
								<image src="https://pw.qyang.cc/static/black-pinglun.png" mode="aspectFit"></image>
								{{ item.comment_num }}
							</view>
							<button open-type="share" class="share" @click.stop="handleShare(item)">
								<image src="https://pw.qyang.cc/static/black-fenxiang.png" mode="aspectFit"></image>
							</button>
							<image src="https://pw.qyang.cc/static/svg/black-3dian.svg" mode="aspectFit"
								@click.stop="handleMore(item)"></image>
						</view>

					</view>
				</view>
				<u-popup :show="isXiajiaTip" mode="center" @close="isXiajiaTip = false" :closeable="true" round="10">
					<view class="pop-bg1">
						下架说明：
						<view class="text">
							<u--textarea v-model="content_declare" placeholder="请输入..." height="100"
								disabled></u--textarea>
						</view>
					</view>
				</u-popup>
				<!-- 展示更多——举报 -->
				<u-popup :show="showMore" :round="10" mode="bottom" @close="showMore = false" @open="showMore = true">
					<view class="pop-content">
					<!-- 	<view class="text" @click="manage" v-if="groupId == 3">
							管理
						</view> -->
						<!-- 管理 -->
						<u-popup :show="showManage" :round="10" mode="bottom" @close="showManage = false"
							@open="showManage = true">
							<view class="pop-content">
								<view class="title">
									管理
								</view>
								<view class="con">

									<view class="con1">
										<view class="con1-2" @click="selectStatus('1')">
											<image class="btn-img1" v-if="model.status == '1'"
												src="https://pw.qyang.cc/static/commit-success.png" mode="">
											</image>
											<image class="btn-img1" v-else
												src="https://pw.qyang.cc/static/selected-null.png" mode=""></image>
											正常
										</view>
										<view class="con1-2" @click="selectStatus('-1')">
											<image class="btn-img1" v-if="model.status == '-1'"
												src="https://pw.qyang.cc/static/commit-success.png" mode="">
											</image>
											<image class="btn-img1" v-else
												src="https://pw.qyang.cc/static/selected-null.png" mode=""></image>
											下架
										</view>
									</view>
									<view class="con2">
										推荐
										<u-input class="input" type="number" v-model="model.weigh"
											placeholder="请输入推荐值数值" border="none" inputAlign="right"></u-input>
									</view>
									<view class="con3">
										操作说明 <span class="con3-text">（说明文字将同步到用户）</span>
										<view class="con3-input">
											<u--textarea v-model="model.declare" placeholder="请输入"></u--textarea>
										</view>
									</view>
								</view>
								<view class="pop-bottom">
									<view class="btn1" @click="showManage = false">
										取消
									</view>
									<view class="btn2" @click="editStatus">
										确认
									</view>
								</view>
							</view>
						</u-popup>
						<view class="text" @click="goPage('report', currentItem)">
							举报
						</view>
						<view class="pop-bottom">
							<view class="btn" @click="showMore = false">
								取消
							</view>
						</view>
					</view>
				</u-popup>
				<!-- 展示更多——自己的帖子 -->
				<u-popup :show="showMore1" :round="10" mode="bottom" @close="showMore1 = false"
					@open="showMore1 = true">
					<view class="pop-content">
						<view class="text" @click="edit()">
							编辑
						</view>
						<view class="text" @click="del()">
							删除
						</view>
						<view class="pop-bottom">
							<view class="btn" @click="showMore1 = false">
								取消
							</view>
						</view>
					</view>
				</u-popup>
				<u-popup :show="showTip" mode="center" @close="showTip = false" @open="showTip = true" :closeable="true"
					round="10">
					<view class="pop-bg">
						提示
						<view class="text">
							确认删除此动态？
						</view>
						<view class="btn">
							<view class="confirm" @click="showTip = false">我再想想</view>
							<view class="cancel" @click="confirmTip">确认删除</view>
						</view>
					</view>
				</u-popup>

				<!-- <view class="dynamicList" v-for="(item,index) in dynamicList">
					<view class="left">
						<view class="day">
							{{item.createtime.split(" ")[0].split("-")[2]}}
						</view>
						<view class="year">
							{{item.createtime.split(" ")[0].split("-")[0]}}
						</view>
						<view class="year">
							{{item.createtime.split(" ")[0].split("-")[1]}}
						</view>
					</view>
					<view class="dian">
					</view>
					<view class="right">
						<view class="r1">
							<view class="fenlei">
								<view class="fenlei1">
									{{item.category.name}}
								</view>
							</view>
							<view class="status" v-if="item.status==1" @click="isXiajiaTip = true">
								已下架
							</view>
						</view>
						<u-popup :show="isXiajiaTip" mode="center" @close="isXiajiaTip=false" :closeable="true"
							round="10">
							<view class="pop-bg1">
								下架说明：
								<view class="text">
									<u--textarea v-model="content" placeholder="请输入..." height="100"
										disabled></u--textarea>
								</view>
							</view>
						</u-popup>
						<view class="r4">
							<span v-html="item.content"></span>
					
						</view>
						<view class="r5">
							<view class="image" v-for="i in item.imageList">
								<image :src="i.src" mode="" style="width: 86px;height: 86px;"></image>
							</view>
						</view>
						<view class="r6" v-if="item.guanlian">
							<image src="https://pw.qyang.cc/static/svg/xin.svg" mode="aspectFit">
							</image>
							{{item.guanlian.time}}&nbsp;&nbsp;{{item.guanlian.city}}&nbsp;&nbsp;{{item.guanlian.name}}
						</view>
						<view class="r7" v-if="item.activity" v-for="(item1,index1) in item.activity">
							<image src="https://pw.qyang.cc/static/icon2.png" mode="aspectFit">
							</image>
							{{item1.name}}
						</view>
						<view class="r9" v-if="item.location">
							<image src="https://pw.qyang.cc/static/svg/dingwei.svg" mode="aspectFit">
							</image>
							{{item.location}}
						</view>
						<view class="r8">
							<view class="image" @click="handleZan(item,index)">
								
								<image src="https://pw.qyang.cc/static/icon-zan1.png" v-if="item.is_upvote" mode="aspectFit"></image>
								<image src="https://pw.qyang.cc/static/icon-zan.png" v-else mode="aspectFit"></image>
								{{item.zanNum}}
							</view>
							<view class="image" @click="handleCang(item,index)">
								<image src="https://pw.qyang.cc/static/icon_cang1.png" v-if="item.is_collect" mode="aspectFit"></image>
								<image src="https://pw.qyang.cc/static/svg/black-shoucang.svg" v-else mode="aspectFit"></image>
								
								{{item.cangNum}}
							</view>
							<view class="image" @click="handleComment(item,index)">
								<image src="https://pw.qyang.cc/static/svg/black-pinglun.svg" mode="aspectFit"></image>
								{{item.commentNum}}
							</view>
							<image src="https://pw.qyang.cc/static/svg/black-fenxiang.svg" mode="aspectFit"
								@click="handleShare(item,index)">
							</image>
							<image src="https://pw.qyang.cc/static/svg/black-3dian.svg" mode="aspectFit"
								@click="handleMore(item,index)"></image>
						</view>
					</view>
				</view> -->
			</view>
		</view>

		<view class="bottom">
			<view class="text" @click="shouCang()">
				<image v-if="!isCang" src="https://pw.qyang.cc/static/svg/black-shoucang.svg" mode=""></image>
				<image v-else src="https://pw.qyang.cc/static/icon_cang1.png" mode=""></image>
				收藏
			</view>
			<view class="btn" v-if="userInfo.online == 1 && userInfo.id != myInfo.id" @click="getOrder()">下单</view>
			<view class="btn hui" v-else @click="getOrderTips">下单</view>
		</view>
		<u-popup :show="isRealTip" mode="center" @close="isRealTip = false" :closeable="true" round="10">
			<view class="pop-bg1">
				实名认证说明：
				<view class="text">
					<u--textarea v-model="shiming" placeholder="请输入..." height="100" disabled></u--textarea>
				</view>
			</view>
		</u-popup>
		<u-popup :show="isScoreTip" mode="center" @close="isScoreTip = false" @open="openScoreTip" :closeable="true"
			round="10">
			<view class="pop-bg1">
				评分说明：
				<view class="text">
					<u--textarea v-model="pingfen" placeholder="请输入..." height="100" disabled></u--textarea>
				</view>
			</view>
		</u-popup>

		<u-popup :show="showOrder" mode="bottom" @close="showOrder = false" @open="openOrder" closeOnClickOverlay
			round="10">
			<view class="order-content">
				<view class="guanggao" v-if="adImg.status == 1">
					<view class="closeIcon" @click="showOrder = false">
						<u-icon name="close" color="#ffffff" size="20"></u-icon>
					</view>
					<image :src="rq.imgUrl(adImg.image)" class="adImage" mode="heightFix"></image>
				</view>
				<view class="content">
					<view class="con1" @tap="getAddress">
						<i class="iconfont">&#xe62c;</i>
						<span class="text1">地点</span> <span class="text2" style="width: 44%;" @tap="getAddress">{{
			address_info.address ? address_info.address : '' }}
						</span>
						<view class="right-btn">
							<span class="text3" v-if="address_info.money">路费{{ address_info.money }}元</span>
							<image @tap.stop="isTollsTip = true" v-if="address_info.money"
								src="https://pw.qyang.cc/static/icon_tip.png" mode=""></image>
							<u-icon name="arrow-right" @tap.stop="getAddress" size="14" color="#999999"></u-icon>
						</view>

						<u-popup :show="isTollsTip" mode="center" @close="isTollsTip = false" :closeable="true"
							round="10">
							<view class="pop-bg1">
								路费计算说明：
								<view class="text">
									<u--textarea v-model="lufei" height="100" disabled></u--textarea>
								</view>
							</view>
						</u-popup>

					</view>
					<view class="con1" @click="chooseTime()">
						<i class="iconfont">&#xe65f</i> <span class="text1">时间</span> <span class="text2">
							{{ formatDate(selectedTime) }}
						</span>
						<view class="right-btn">
							<u-icon name="arrow-right" size="14" color="#999999"></u-icon>
						</view>
					</view>

					<view class="con1" @click="chooseRemark()">
						<i class="iconfont">&#xe648;</i> <span class="text1">备注</span> <span
							class="text2">{{ remarkContent ? remarkContent : '暂无备注' }}</span>
						<view class="right-btn">
							<u-icon name="arrow-right" size="14" color="#999999"></u-icon>
						</view>
					</view>

					<u-datetime-picker :show="showTime" v-model="valueTime" mode="datetime" @confirm="confirmTime"
						@cancel="showTime = false" :formatter="formatter"></u-datetime-picker>

					<u-popup :show="showRemark" mode="center" @close="showRemark = false" @open="openRemark"
						:closeable="true" round="10">
						<view class="pop-bg">
							备注：
							<view class="text">
								<u--textarea v-model="remarkContent" placeholder="请输入..." count maxlength="60"
									height="100"></u--textarea>
							</view>

							<view class="btn">
								<view class="cancel" @click="showRemark = false">取消</view>
								<view class="confirm" @click="confirmRemark">确认</view>
							</view>
						</view>
					</u-popup>
				</view>

				<view style="background:#f3f3f3;overflow: hidden;">
					<view class="content-item" v-for="(item, index) in fuwulist" :key="index"
						@click="selectServiceItem(item)" :style="{
			backgroundColor: item.selected ? '#FFE2E5;' : '',
			border: item.selected ? '1px solid #000000' : ''
		}">
						<view style="width: 45px;">
							<image :src="rq.imgUrl(item.image)" mode="aspectFit"></image>
						</view>
						<view class="item1">
							<view class="name">
								{{ item.name }}
							</view>
							<view class="text1">
								<text>{{ item.price }}元/小时</text>
								<span class="text11">{{ item.describe ? item.describe : '' }}</span>
							</view>
						</view>
						<view class="item2">
							<view class="text2">
								<u-number-box v-model="numValues[item.id]" :name="numValues[item.id]" min="0"
									:integer="true" @input="getAllMoney">
									<view slot="minus" class="minus">
										<u-icon name="minus" color="#FF7681" size="12"></u-icon>
									</view>
									<text slot="input" class="input">{{ numValues[item.id] ? numValues[item.id] :
			0 }}</text>
									<view slot="plus" class="plus">
										<u-icon name="plus" color="#ffffff" size="12"></u-icon>
									</view>
								</u-number-box>
							</view>
						</view>

					</view>

					<view class="content1">
						<view class="quan" @click="chooseQuan()" v-if="!selectedQuanItem">
							<view class="name">
								优惠券
							</view>
							<view class="right">
								<view class="money">
									未使用优惠券
								</view>
								<view class="right-btn">
									<u-icon name="arrow-right" size="14" color="#FF7681"></u-icon>
								</view>
							</view>
						</view>
						<view class="quan" @click="chooseQuan()" v-else>
							<view class="name">
								{{ selectedQuanItem.name }}
							</view>
							<view class="right">
								<view class="money">
									-{{ selectedQuanItem.type=="FULL"?selectedQuanItem.money:Number(selectedQuanItem.discount) }}{{selectedQuanItem.type=="FULL"?'元':'%'}}
								</view>
								<view class="right-btn">
									<u-icon name="arrow-right" size="14" color="#FF7681"></u-icon>
								</view>
							</view>
						</view>
					</view>
					<!-- <u-popup :show="showQuan" mode="bottom" @close="showQuan=false" @open="openQuan" :closeable="true"
						round="10">
						<view class="pop-bg">
							<view class="title">
								优惠券
							</view>
							<view class="bg" v-if="quanList.length>0">
								<view class="bg-quan" v-for="(item,index) in quanList" @click="selectQuanItem(item)">
									<view class="price">
										<span style="font-weight: 600;font-size: 13px;">￥</span>{{item.money}} <br>
										<span class="text1">{{item.text}}</span>
									</view>
									<view class="text">
										{{item.name}} <br> <span class="text2">{{item.time}}</span>
									</view>
									<image class="btn-img1" v-if="item.selected"
										src="https://pw.qyang.cc/static/commit-success.png" mode="">
									</image>
									<image class="btn-img1" v-else src="https://pw.qyang.cc/static/selected-null.png"
										mode=""></image>
								</view>
							</view>
							<view class="bg bg-null" v-else>
								<image class="null-img" src="https://pw.qyang.cc/static/icon-null.png" mode=""></image>
								<view class="null-text">
									暂无优惠券
								</view>
							</view>
							<view class="btn">
								<view class="confirm" @click="confirmQuan">确认</view>
							</view>
						</view>
					</u-popup> -->
					<u-popup :show="showQuan" mode="bottom" @close="showQuan = false" @open="openQuan" :closeable="true"
						round="10">
						<view class="pop-bg">
							<view class="title">
								优惠券
							</view>
							<view class="bg" v-if="quanList.length > 0">
								<view class="bg-quan" v-for="(item, index) in quanList" :key="index" @click="selectQuanItem(item,index)">
									<view class="price">{{ item.type == 'FULL' ? Number(item.money) : Number(item.discount) }}<text
											style="font-size: 40rpx;">{{ item.type == 'FULL' ? '元' : '%' }}</text><br>
										<span class="text1">满{{ item.min_money }}可抵用</span>
									</view>
									<view class="text">
										{{ item.name }} <br> <span
											class="text2">{{ item.start_time }}-{{ item.expire_time }}</span>
									</view>
									<image class="btn-img1" v-if="item.selected"
										src="https://pw.qyang.cc/static/commit-success.png" mode="">
									</image>
									<image class="btn-img1" v-else src="https://pw.qyang.cc/static/selected-null.png"
										mode=""></image>
								</view>
							</view>
							<view class="bg bg-null" v-else>
								<image class="null-img" src="https://pw.qyang.cc/static/yhq.png" mode="aspectFill">
								</image>
								<view class="null-text">
									您暂时没有优惠券
								</view>
							</view>
							<view class="btn">
								<view class="confirm" @click="confirmQuan">确认</view>
							</view>
						</view>
					</u-popup>
				</view>

				<view class="bottom">
					<view class="text" @click="reset()">重置</view>
					<view class="btn" @click="toPay()">去支付 {{ allMoney }} 元</view>
				</view>
			</view>
		</u-popup>

	</view>
</template>

<script>
import {plus,minus,times,divide} from '@/utils/util.js'
export default {
	data() {
		return {
			statusBarHeight: 0,
			statusBarHeight1: 0,
			titleBarHeight: 0,
			showInfo: true,
			showOrder: false,
			isCang: false,
			isGuanggao: false,
			isScoreTip: false,
			isTollsTip: false,
			isXiajiaTip: false,
			isRealTip: false,
			currentNum: 0,
			maxShowLength: 50,
			showQuan: false,
			showTime: false,
			showRemark: false,
			showAddress: false,
			valueTime: Number(new Date()),
			selectedTime: Number(new Date()),
			selectedQuanItem: null,
			quanItem: null,
			remarkContent: '',
			numValue: 1,
			numValues: {},
			showAllContent: {},
			selectedServiceList: [],
			quanList: [],
			serviceList: [],
			bannerList: [
				"https://pw.qyang.cc/static/banner1.png",
				"https://pw.qyang.cc/static/banner2.png",

			],
			userInfo: {},
			tablist1: [{
				name: '资料'
			}, {
				name: '动态'
			}],
			tabsList: [{
				src: 'https://pw.qyang.cc/static/i1.png',
				name: '真人验证'
			},
			{
				src: 'https://pw.qyang.cc/static/i2.png',
				name: '平台保障'
			},
			{
				src: 'https://pw.qyang.cc/static/svg/xin.svg',
				name: '用心服务'
			},
			{
				src: 'https://pw.qyang.cc/static/svg/biao.svg',
				name: '随叫随到'
			},
			],
			fuwulist: [{
				name: '服务1'
			},

			],
			dynamicList: [],
			commentList: [],
			content: '这是一段后台传入的说明文本内容文本内容文本内容文本内容文本内容...',
			darenInfo: [],
			lng: '',
			lat: '',
			pingfen: '',
			shiming: '',
			lufei: '',
			address_id: 0,
			address_info: {},
			addressList: [],
			allMoney: 0,
			pay_json: [],
			currentIndex: 0,
			dynamicPage: 1,
			dynamicData: {},
			showMore: false,
			showMore1: false,
			model: {},
			myInfo: {},
			adImg: {},
			currentBanner: 0,
			timer: null,
			content_declare: '',
			city_id: null,
			dw: null,
			isChooseCoupe:false,
		};
	},
	onShareAppMessage() {
		return {
			title: '达人信息',
			path: '/subpages/talent/talent?id=' + this.id,
		}
	},
	onShareTimeline() {
		return {
			title: '达人信息',
			path: '/subpages/talent/talent?id=' + this.id,
		}
	},
	onLoad(e) {
		this.dw = uni.getStorageSync('dw')
		this.city_id = this.dw.id
		uni.getSystemInfo({
			success: (res) => {
				// #ifdef MP-WEIXIN
				this.statusBarHeight1 = uni.getMenuButtonBoundingClientRect().top;
				this.titleBarHeight = uni.getMenuButtonBoundingClientRect().height;
				this.statusBarHeight = this.titleBarHeight + this.statusBarHeight1;
				// #endif
				// #ifndef MP-WEIXIN
				this.statusBarHeight = res.statusBarHeight * 1 + 46;
				this.statusBarHeight1 = res.statusBarHeight;
				// #endif
			},
		});
		//广告
		this.rq.getData('index/ad').then(res => {
			this.adImg = res.data
		})
		this.myInfo = JSON.parse(uni.getStorageSync('userInfo'))
		this.get_dingwei()
		this.initContentLines();
		this.id = e.id
		this.getRealText()
		this.getPingfenText()

		this.getLufeiText()

		this.getDetail()
		this.getService()
		this.getDynamicList()
		this.getCoupon()

		if (e.type == 'manage') {
			this.showInfo = false
			this.currentIndex = 1
		}
		let _this = this
		this.timer = setInterval(() => {
			_this.rq.getData('daren/status', {
				id: this.id
			}).then(res => {
				// console.log(res.data)
				_this.userInfo.online = res.data
			})
		}, 3000)
	},
	onShow() {
		uni.$on('address', (data) => {
			this.address_info = data;
			this.address_id = data.id
			this.getDefaultAddress()
			// this.getAllMoney()
		})

	},
	onUnload() {
		clearInterval(this.timer)
		uni.$off('address')
	},
	onHide() {
		clearInterval(this.timer)
	},
	methods: {
		handleShare(item) {
			let _this = this
			//#ifdef APP
			uni.share({
			    provider: 'weixin',
			    scene: "WXSceneSession",
			    type: 5,
			    imageUrl:'https://pw.qyang.cc/static/basicprofile.png',
			    title: '达人信息',
			    miniProgram: {
			        id: 'gh_30c9bdca022b',
			        path: 'subpages/talent/talent?id=' + _this.id,
			        type: _this.rq.isTest?2:0,
			        webUrl: 'https://pw.qyang.cc'
			    },
			    success: ret => {
			        console.log(JSON.stringify(ret));
			    },
				fail: (err) => {
					console.log(JSON.stringify(err));
				}
			});
			//#endif
		},
		getCoupon(more) {
			this.rq.getData('Market/getMyCoupons', {
				status: 0
			}).then(res => {
				if (more) {
					this.quanList = [...this.quanList, ...res.data.data]
				} else {
					this.quanList = res.data.data
				}
				this.quanTotal = res.data.total
				uni.stopPullDownRefresh()
			}).catch(() => {
				uni.stopPullDownRefresh()
			})
		},
		getService() {
			this.rq.getData('daren/daren_info', {
				id: this.id,
				type: 1
			}).then(res => {
				this.darenInfo = res.data
				this.fuwulist = res.data.service
			})
		},
		getDynamicList() {
			var that = this;
			var page = this.dynamicPage;
			if (!page) {
				page = 1
			}
			if (this.dynamicPage == 1) {
				this.dynamicList = [];
			}
			// console.log(this.dynamicPage,'this.dynamicPage')
			if (this.dynamicData.last_page && page > 1 && page > this.dynamicData.last_page) {
				return;
			}
			this.rq.getData('daren/daren_dynamic', {
				id: this.id,
				page: page
			}).then(res => {
				this.dynamicData = res.data
				this.dynamicList = this.dynamicList.concat(res.data.data)
			})
		},
		getAddress() {
			uni.navigateTo({
				url: '/subpages/set/address'
			})
			// let _this = this
			// uni.chooseLocation({
			// 	success: async (res) => {
			// 		_this.address_info.lat = res.latitude
			// 		_this.address_info.lng = res.longitude
			// 		_this.address_info.address = res.name

			// 		_this.getAddressMoney(res.latitude, res.longitude)
			// 	},
			// 	fail: (res) => {
			// 		console.log(res)
			// 	}
			// })
		},
		getAddressMoney(lat, lng) {
			this.rq.getData('order/distance', {
				start_lat: Number(this.userInfo.lat),
				start_lng: Number(this.userInfo.lng),
				end_lat: lat,
				end_lng: lng,
				city: this.city_id
			}).then(res => {
				this.$set(this.address_info, 'money', res.data.price)
				this.getAllMoney()
			}).catch(err => { })
		},
		async getDefaultAddress() {
			// 获取默认地址
			const {
				data	
			} = await this.rq.getData('address/getDefaultAddress', {
				lat: this.userInfo.lat,
				lng: this.userInfo.lng,
				city_id: this.city_id,
				id:this.address_id
			})
			if(data.id) {
				this.address_info = data
				this.address_id = data.id
				this.getAddressMoney(data.lat, data.lng)
			}

			// 根据定位获取当前位置
			// const {
			// 	data
			// } = await this.rq.getData('daren/getAddress', {
			// 	lat: this.dw.lat,
			// 	lng: this.dw.lng
			// })
			// this.address_info.address = data.address
			// this.address_info.lat = this.dw.lat
			// this.address_info.lng = this.dw.lng
			// this.getAddressMoney(this.dw.lat, this.dw.lng)
		},
		getAllMoney() {
			this.allMoney = 0;
			if (this.address_info && this.address_info.money) {
				this.allMoney = this.address_info.money * 1;
			}
			console.log(this.allMoney, "this.allMoney1")
			var numVales = this.numValues;
			var pay_json = [];
			console.log(this.fuwulist, "numVales")
			for (var i in numVales) {
				for (var j in this.fuwulist) {
					if (numVales[i] > 0 && this.fuwulist[j].id == i) {
						this.allMoney = plus(this.allMoney,times(this.fuwulist[j].price,numVales[i]));
						
						pay_json.push({
							id: this.fuwulist[j].id,
							name: this.fuwulist[j].name,
							price: this.fuwulist[j].price,
							times: numVales[i]
						})
					}
				}
			}
			this.pay_json = pay_json

			console.log(this.quanItem, "this.quanItem")
			if (this.pay_json.length == 0) {	
				this.selectedQuanItem = this.quanItem = null
				if (this.allMoney < 0) this.allMoney = 0
			} else {
				if(!this.isChooseCoupe){
					this.quanList.map(item=>{
						item.selected = false
					})
					for (let i = 0; i < this.quanList.length; i++) {
						if (this.allMoney * 1 >= this.quanList[i].min_money * 1) {
							this.selectedQuanItem = this.quanItem = this.quanList[i]
							this.quanItem.selected = true
							/* 优惠券 */
							if (this.quanItem&&this.quanItem.id) {
								if (this.quanItem.type == 'FULL') {
									this.allMoney = minus(this.allMoney,this.quanItem.money);									
								} else {
									this.allMoney = minus(this.allMoney,divide(times(this.allMoney,this.quanItem.discount),100));	
								}
							}
							if (this.allMoney < 0) this.allMoney = 0
							return
						}
					}
				}else{
					if (this.quanItem&&this.quanItem.id) {
						if (this.quanItem.type == 'FULL') {
							this.allMoney = minus(this.allMoney,this.quanItem.money);		
						} else {
							this.allMoney = minus(this.allMoney,divide(times(this.allMoney,this.quanItem.discount),100));
						}
					}
					if (this.allMoney < 0) this.allMoney = 0
				}				
			}

			console.log(this.allMoney, "this.allMoney33")

		},
		bannerChange(e) {
			this.currentBanner = e.detail.current
		},
		getRealText() {
			this.rq.getData('common/agreement', {
				type: 'shiming'
			}).then(res => {
				this.shiming = res.data.data
			})
		},
		getPingfenText() {
			this.rq.getData('common/agreement', {
				type: 'pingfen'
			}).then(res => {
				this.pingfen = res.data.data
			})
		},
		getLufeiText() {
			this.rq.getData('common/agreement', {
				type: 'lufei'
			}).then(res => {
				this.lufei = res.data.data
			})
		},
		getDetail() {
			this.rq.getData('daren/daren_detail', {
				id: this.id,
				lng: this.lng,
				lat: this.lat
			}).then(res => {
				this.userInfo = res.data
				this.isCang = res.data.is_collect
				this.getDefaultAddress()
				this.bannerList = res.data.images_arr
			})
		},
		getAddressList() {
			this.rq.getData('address/list').then(res => {
				this.addressList = res.data
			})
		},
		previewImage(item) {
			uni.navigateTo({
				url: '/subpages/talent/picDetail?id=' + this.userInfo.id
			})
			// var list = []

			// list.push(this.rq.imgUrl(this.userInfo.breviary_image))
			// for (var i = 0; i < this.bannerList.length; i++) {
			// 	list.push(this.rq.imgUrl(this.bannerList[i]))
			// }
			// uni.previewImage({
			// 	current: item, // 当前显示图片的http链接
			// 	urls: list // 需要预览的图片http链接列表
			// });

		},
		chooseQuan() {
			if(this.pay_json.length == 0){
				this.selectedQuanItem = this.quanItem = null
				this.quanList.map(item=>{
					item.selected = false
				})
			}
			this.showQuan = true
		},
		chooseTime() {
			this.showTime = true
		},
		chooseRemark() {
			this.showRemark = true
		},
		openOrder() {
			this.showOrder = true
		},
		openRemark() {
			this.showRemark = true
		},
		openQuan() {
			if(this.pay_json.length == 0){
				this.selectedQuanItem = this.quanItem = null
			}
			this.showQuan = true
		},
		openScoreTip() {
			this.isScoreTip = true
		},
		showScoreTip() {
			this.isScoreTip = true
		},
		formatDate(timestamp) {
			const date = new Date(timestamp);
			const year = date.getFullYear();
			const month = (date.getMonth() + 1).toString().padStart(2, '0');
			const day = date.getDate().toString().padStart(2, '0');
			const hour = date.getHours().toString().padStart(2, '0');
			const minute = date.getMinutes().toString().padStart(2, '0');
			return `${year}-${month}-${day} ${hour}:${minute}`;
		},
		formatter(type, value) {
			if (type === 'year') {
				return `${value}年`;
			}
			if (type === 'month') {
				return `${value}月`;
			}
			if (type === 'day') {
				return `${value}日`;
			}
			if (type === 'hour') {
				return `${value}时`;
			}
			if (type === 'minute') {
				return `${value}分`;
			}
			return value;
		},
		showDeclare(item) {
			this.content_declare = item.declare;
			this.isXiajiaTip = true
		},
		confirmTime(e) {
			this.showTime = false
			this.selectedTime = e.value
		},
		confirmRemark() {
			this.showRemark = false
		},
		confirmQuan() {
			this.showQuan = false
			this.selectedQuanItem = this.quanItem
		},
		selectQuanItem(item,index) {
			if(this.pay_json.length == 0){
				uni.showToast({
					title:'请选择服务项目~',
					icon:'none'
				})
				return
			}else{
				this.isChooseCoupe = true
			}
			this.quanList.map((quan,i) => {
				if(index==i){
					if(quan.selected){
						quan.selected = false
						this.selectedQuanItem = this.quanItem = null
					}else{
						quan.selected = true;
						this.selectedQuanItem = this.quanItem = quan
					}
				}else{
					quan.selected = false
				}
			});
			// this.$set(this.quanList,index,item)
			this.getAllMoney();
			console.log(this.quanItem);
			// console.log(item);
		},
		selectServiceItem(item) {
			const index = this.selectedServiceList.findIndex(selected => selected.name === item.name);
			if (index > -1) {
				// 如果已存在，从selectedServiceList数组中移除该项
				this.selectedServiceList.splice(index, 1);
				item.selected = false;
			} else {
				// 如果不存在，添加到selectedServiceList数组，并设置为选中状态
				this.selectedServiceList.push(item);
				item.selected = true;
			}
			console.log(this.serviceList);
			console.log(item);
		},
		removeSelectedService(selectedItem) {
			// 从selectedServiceList数组中移除当前点击要删除的服务项
			const index = this.selectedServiceList.indexOf(selectedItem);
			if (index > -1) {
				this.selectedServiceList.splice(index, 1);
			}
			// 在serviceList中找到对应的服务项，并将其选中状态重置为false
			const correspondingItem = this.serviceList.find(service => service.name === selectedItem.name);
			if (correspondingItem) {
				correspondingItem.selected = false;
			}
		},
		toPay() {
			var that = this
			/* ifdef H5*/
			var platform = 'h5'
			/* endif*/
			/* ifdef MP-WEIXIN*/
			var platform = 'wechat'
			/* endif*/
			/* ifdef APP-PLUS*/
			var platform = 'app'
			/* endif*/
			if(this.address_id == 0) {
				uni.showToast({
					title: '请选择地址',
					icon: 'none',
					duration: 1500
				});
				setTimeout(() => {
					uni.navigateTo({
						url: '/subpages/set/address'
					})
				}, 1500);
				return;
			}
			if (this.fuwulist.length == 0) {
				uni.showToast({
					title: '该达人未开通服务项目',
					icon: 'none',
					duration: 2000
				});
				return;
			}
			if (this.pay_json.length == 0) {
				uni.showToast({
					title: '请选择服务项目',
					icon: 'none',
					duration: 2000
				});
				return;
			}
			var data = {
				daren_id: this.id,
				pay_type: "",
				start_time: this.selectedTime,
				notes: this.remarkContent,
				play_json: this.pay_json,
				lng: this.address_info.lng,
				lat: this.address_info.lat,
				address_id: this.address_id,
				city_id: this.city_id,
				address: this.address_info.address,
				platform: platform,
				coupon_id: this.quanItem ? this.quanItem.id : 0
			};
			if (uni.getStorageSync('openid')) {
				data.openid = uni.getStorageSync('openid');
			}

			this.rq.getData('order/prepay', data).then(res => {
				that.quanItem = null
				that.selectedQuanItem = null
				that.getCoupon(false)
				uni.navigateTo({
					url: '/subpages/pay/pay?money=' + this.allMoney + '&type=order&id=' + res.data
						.order.id
				})
			})

			// console.log('支付');
			// uni.navigateTo({
			// 	url: '/subpages/pay/pay?money=' + 1200
			// })
		},
		previewMedia(item, media) {
			uni.navigateTo({
				url: '/pages/square/picDetail?id=' + item.id + '&index=' + media
			})
		},
		reset() {
			var numVales = this.numValues;

			for (var i in this.numValues) {
				this.numValues[i] = 0;
			}

			this.getAllMoney()
			console.log('清空重置');
		},
		handleZan(item, index) {
			this.rq.getData('collect/set_upvote', {
				id: item.id,
				class: 'upvote',
				type: 1
			}).then(res => {
				if (res.code === 1) {
					this.dynamicList[index].is_upvote = this.dynamicList[index].is_upvote == 1 ? 0 : 1
					this.dynamicList[index].upvote_num =
						this.dynamicList[index].is_upvote == 1 ?
							this.dynamicList[index].upvote_num + 1 : this.dynamicList[index].upvote_num - 1
				}
			})
		},
		handleCang(item, index) {
			this.rq.getData('collect/set_upvote', {
				id: item.id,
				class: 'collect',
				type: 1
			}).then(res => {
				if (res.code === 1) {
					this.dynamicList[index].is_collect = this.dynamicList[index].is_collect == 1 ? 0 : 1
					this.dynamicList[index].collect_num = this.dynamicList[index].is_collect == 1 ? this
						.dynamicList[index].collect_num + 1 : this.dynamicList[index].collect_num - 1
				}
			})
		},
		handleComment(item) {
			console.log('评论');
		},
		editStatus() {
			this.model.recommend = this.model.weigh * 1 > 0 ? 1 : 2
			this.rq.getData('agent/post_status', this.model).then(res => {
				if (res.code == 1) {
					uni.showToast({
						title: '修改成功~',
						icon: 'none'
					})
					this.page = 1
					this.getList()
					this.showManage = false
				}
			})
		},
		handleMore(item) {
			let userInfo = uni.getStorageSync('userInfo') ? JSON.parse(uni.getStorageSync('userInfo')) : null
			this.currentItem = item
			this.groupId = userInfo.group_id
			// 是自己发布的帖子
			if (item.user.id == userInfo.id) {
				this.showMore1 = true
			} else {
				// 别人发布的——举报
				this.showMore = true
			}
		},
		handleCommont(item) {
			uni.navigateTo({
				url: "/pages/square/detail?id=" + item.id
			})
		},
		edit() {
			var that = this
			uni.navigateTo({
				url: '/pages/square/publish?id=' + that.currentItem.id
			})
		},
		del() {
			// this.showTip = true

			var that = this
			uni.showModal({
				title: "删除动态",
				content: "确认删除动态~",
				success(res) {
					if (res.confirm) {
						that.doDel(that.currentItem)
					} else if (res.cancel) {
						console.log('用户点击取消');
					}
				}

			})
		},
		doDel(item) {
			var that = this
			this.rq.getData('dynamic/delete', {
				id: item.id
			}).then(res => {
				uni.showToast({
					title: res.msg,
					icon: 'none'
				})
				that.dynamicPage = 1;
				that.getDynamicList()
			})
			this.showMore1 = false
		},

		goBack() {
			uni.navigateBack()
		},
		click(item) {
			if (item.name == '资料') {
				this.showInfo = true
			} else {
				this.showInfo = false
			}
		},
		showContent(content) {
			const currentItem = this.dynamicList.find(item => item.content === content);
			if (currentItem.isExpanded) {
				return content;
			}
			return content.slice(0, this.maxShowLength);
		},
		// 点击展开/收起按钮的处理方法
		toggleExpand(item, index) {
			this.dynamicList[index].isExpanded = !this.dynamicList[index].isExpanded;
		},
		shouCang() {
			this.isCang = !this.isCang
			this.rq.getData('collect/set_upvote', {
				id: this.id,
				class: 'collect',
				type: 2
			}).then(res => { })
		},
		getOrder() {
			this.showOrder = true
		},
		getOrderTips() {
			if (this.userInfo.id == this.myInfo.id) {
				uni.showToast({
					title: '自己不可为自己下单',
					icon: 'none'
				})
				return
			}
			if (this.userInfo.online != 1) {
				uni.showToast({
					title: '达人未在线，请选择其他达人',
					icon: 'none'
				})
				return
			}
		},
		initContentLines() {
			const defaultFields = {
				isExpanded: false
			};
			this.dynamicList = this.dynamicList.map(item => {
				// 使用Object.assign方式添加字段
				return Object.assign({}, item, {
					// contentLines: this.calculateContentLines(item.content),
					isExpanded: false
				});
			});
		},
		get_dingwei() {
			if (uni.getStorageSync('dingwei')) {
				var dingwei = uni.getStorageSync('dingwei')
				this.lat = dingwei.lat
				this.lng = dingwei.lng
			} else {
				var that = this
				uni.getLocation({
					type: 'gcj02',
					isHighAccuracy: true,
					success: r => {
						this.lat = r.latitude
						this.lng = r.longitude
						uni.setStorageSync("dingwei", {
							lat: r.latitude,
							lng: r.longitude
						})

					},
					fail: (err) => {
						console.log(err)
					},
					complete: () => { }
				});
			}

		},
		goPage(url, item) {
			if (item) {
				const id = item.id
				uni.navigateTo({
					url: `/pages/square/${url}?id=${id}`
				})
			} else {
				uni.navigateTo({
					url: `/pages/square/${url}`
				})
			}
		},
	}

}
</script>

<style lang="scss">
.pj {
	background-image: url('https://pw.qyang.cc/static/svg/pj_bg.svg');
	background-repeat: no-repeat;
	background-size: 306rpx 36rpx;
	background-position: 28rpx 30rpx;
}

.fw {
	background-image: url('https://pw.qyang.cc/static/svg/fw_bg.svg');
	background-repeat: no-repeat;
	background-size: 306rpx 36rpx;
	background-position: 28rpx 30rpx;
}

.bq {
	background-image: url('https://pw.qyang.cc/static/svg/bq.svg');
	background-repeat: no-repeat;
	background-size: 306rpx 36rpx;
	background-position: 28rpx 30rpx;
}

.share {
	padding: 0;
	margin: 0;
	background-color: transparent;

	&::after {
		display: none;
	}
}

.app-content {
	width: 100%;
	height: 100%;
	position: relative;
}

.pop-bg1 {
	width: 260px;
	border-radius: 8px;
	opacity: 1;
	background: #FFFFFF;
	font-family: PingFang SC;
	font-size: 16px;
	font-weight: normal;
	line-height: 14px;
	letter-spacing: 0px;
	color: #333333;
	padding: 40rpx;

	.text {
		margin-top: 40rpx;
	}
}

.content-item {
	display: flex;
	align-items: center;
	flex-direction: row;
	background-color: #ffffff;
	margin: 20rpx auto;
	width: 660rpx;
	overflow: hidden;
	border-radius: 8px;
	padding: 20rpx;



	image {
		width: 45px;
		height: 45px;
	}

	.item1 {
		display: flex;
		flex-direction: column;
		padding: 20rpx 22rpx;

		.name {
			font-family: 阿里巴巴普惠体 2.0;
			font-size: 16px;
			font-weight: normal;
			line-height: 16px;
			letter-spacing: 0px;
			color: #333333;
			margin-bottom: 20rpx;
		}

		.text1 {
			/* 最低299元/小时 */
			font-family: 阿里巴巴普惠体 2.0;
			font-weight: 500;
			font-size: 13px;
			// width: 260rpx;
			color: #FF5866;
			display: flex;
			align-items: center;

			text {
				flex-shrink: 0;
			}

			.text11 {
				// width: 50%;
				font-family: 阿里巴巴普惠体 2.0;
				font-weight: 400;
				font-size: 12px;
				color: #999999;
				overflow: hidden;
				text-overflow: ellipsis;
				white-space: nowrap;
				margin-left: 15rpx;
			}
		}
	}

	.item2 {
		display: flex;
		padding: 20rpx 0;
		margin-left: auto;

		.text2 {
			font-family: 阿里巴巴普惠体 2.0;
			font-weight: 500;
			font-size: 12px;
			color: #313232;

			.input {
				font-family: PingFang SC;
				font-size: 18px;
				font-weight: normal;
				line-height: 18px;
				letter-spacing: 0px;
				font-variation-settings: "opsz" auto;
				color: #000000;
				width: 80rpx;
				text-align: center;
			}

			.minus {
				width: 19px;
				height: 19px;
				opacity: 1;
				background: #FFFFFF;
				box-sizing: border-box;
				border: 1px solid #FF7681;
				border-radius: 50%;
				display: flex;
				align-items: center;
				justify-content: center;
			}

			.plus {
				width: 19px;
				height: 19px;
				opacity: 1;
				background: #FF7681;
				box-sizing: border-box;
				border: 1px solid #FF7681;
				border-radius: 50%;
				display: flex;
				align-items: center;
				justify-content: center;
			}
		}
	}

	.item3 {
		display: flex;
		align-items: center;
		justify-content: center;

		.btn {
			width: 90%;
			height: 30px;
			border-radius: 102px;
			opacity: 1;

			background: #F6F6F6;

			border: 1px solid #F6F6F6;
			font-family: PingFang SC;
			font-size: 15px;
			font-weight: normal;
			line-height: 15px;
			text-align: center;
			letter-spacing: 0px;

			color: #333333;
			display: flex;
			align-items: center;
			justify-content: center;
		}
	}
}

.content1 {
	position: absolute;
	bottom: 50px;
	display: flex;
	flex-direction: column;
	margin: 20rpx auto;
	width: 100%;
	overflow: hidden;
	border-radius: 8px;
	padding: 20rpx 0;
	align-items: center;
	justify-content: center;

	.pop-bg {
		// width: 260px;
		height: 320px;
		border-radius: 8px;
		opacity: 1;
		background: #FFFFFF;
		font-family: PingFang SC;
		font-size: 16px;
		font-weight: normal;
		line-height: 14px;
		letter-spacing: 0px;
		color: #333333;
		padding: 40rpx;

		.title {
			display: flex;
			align-items: center;
			justify-content: center;
			font-family: 阿里巴巴普惠体 2.0;
			font-size: 16px;
			font-weight: 500;
			// line-height: 16px;
			letter-spacing: 0px;
			margin-top: 0rpx;
			color: #212121;
		}

		.bg {
			height: 540rpx;
			margin: 40rpx 0;
			overflow-y: scroll;

			.img {
				width: 670rpx;
				height: 194rpx;
				margin-bottom: 20rpx;
			}

			.bg-quan {
				display: flex;
				align-items: center;
				font-family: 阿里巴巴普惠体 2.0;
				font-size: 72px;
				font-weight: 800;
				letter-spacing: 0px;
				color: #FF204A;
				z-index: auto;
				position: relative;
				height: 194rpx;
				// width: 335px;
				margin: 20rpx auto;
				background: url('https://pw.qyang.cc/static/quan-bg.png') center no-repeat;
				background-size: 100%;

				.text {
					font-family: 阿里巴巴普惠体 2.0;
					font-size: 22rpx;
					font-weight: 600;
					line-height: 22rpx;
					color: #212121;
					text-align: center;
					width: 400rpx;
				}

				.text2 {
					font-family: 阿里巴巴普惠体 2.0;
					font-size: 24rpx;
					font-weight: normal;
					line-height: 24rpx;
					margin-top: 32rpx;
					display: block;
					letter-spacing: 0px;
					color: #666666;
				}

				.price {
					font-family: 阿里巴巴普惠体 2.0;
					font-weight: 500;
					font-size: 72rpx;
					width: 184rpx;
					text-align: center;
					white-space: nowrap;
				}

				.text1 {
					font-family: 阿里巴巴普惠体 2.0;
					font-size: 11px;
					font-weight: normal;
					line-height: 11px;
					letter-spacing: 0px;
					color: #FF5866;
				}

				.btn-img1 {
					width: 20px;
					height: 20px;
					position: absolute;
					right: 24px;
				}
			}
		}


		.btn {
			position: absolute;
			bottom: 0;
			left: 40rpx;
			right: 40rpx;

			.confirm {
				width: 100%;
				height: 37px;
				border-radius: 102px;
				opacity: 1;
				background: #FF5866;
				border: 1px solid #FF5866;
				color: #fff;
				display: flex;
				align-items: center;
				justify-content: center;
				margin: 20rpx 0;
			}
		}
	}

	.quan {
		width: 680rpx;
		height: 39px;
		border-radius: 16rpx;
		opacity: 1;

		background: #FFF3F6;

		box-sizing: border-box;
		border: 1px solid #FFB8BE;

		font-family: PingFang SC;
		font-size: 14px;
		font-weight: normal;
		line-height: 30rpx;
		letter-spacing: 0px;

		color: #FF7681;
		display: flex;
		align-items: center;

		.name {
			padding: 10rpx 20rpx;
		}

		.right {
			position: absolute;
			right: 0;
			display: flex;
			align-items: center;

			.money {
				margin: 20rpx;
			}

			.right-btn {

				margin-right: 80rpx;
			}
		}

	}
}

.order-content {
	height: 800rpx;
	padding-bottom: 200rpx;
	overflow-y: scroll;
	// background: #f3f3f3;
	border-radius: 10px;

	.guanggao {
		width: 100%;
		height: 180rpx;
		background: #bbb1b1;
		margin-bottom: -20rpx;
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;

		.closeIcon {
			position: absolute;
			right: 30rpx;
			top: 30rpx;
		}

		.adImage {
			height: 180rpx;
		}
	}

	.bottom .text {
		font-family: 阿里巴巴普惠体 2.0;
		font-size: 26rpx;
		font-weight: normal;
		line-height: 26rpx;
		letter-spacing: 0px;

		color: #333333;
	}
}

.content {
	display: flex;
	flex-direction: column;
	background-color: #ffffff;
	width: 100%;
	overflow: hidden;
	border-radius: 16rpx;
	padding: 20rpx 0;

	.pop-bg {
		width: 520rpx;
		height: 440rpx;
		border-radius: 16rpx;
		opacity: 1;
		background: #FFFFFF;
		font-family: PingFang SC;
		font-size: 32rpx;
		font-weight: normal;
		line-height: 28rpx;
		letter-spacing: 0px;
		color: #333333;
		padding: 40rpx;

		.text {
			margin: 40rpx 0;
		}

		.btn {
			display: flex;
			align-items: center;
			justify-content: center;

			.cancel {
				width: 196rpx;
				height: 68rpx;
				border-radius: 204rpx;
				opacity: 1;

				background: #F7F7F7;

				border: 1px solid #F7F7F7;
				color: #333333;
				display: flex;
				align-items: center;
				justify-content: center;
				margin-right: 40rpx;
			}

			.confirm {
				width: 196rpx;
				height: 68rpx;
				border-radius: 204rpx;
				opacity: 1;

				background: #FF5866;

				border: 1px solid #FF5866;
				color: #ffffff;
				display: flex;
				align-items: center;
				justify-content: center;
			}
		}
	}

	.con1 {
		display: flex;
		align-items: center;

		font-size: 14px;
		font-weight: normal;
		line-height: 14px;
		letter-spacing: 0px;
		padding: 20rpx;
		position: relative;

		.text1 {
			color: #FF7883;
			margin: 0 20rpx;
		}

		.text2 {
			color: #333333;
			overflow: hidden;
			/* 超出元素宽度的内容隐藏起来 */
			text-overflow: ellipsis;
			/* 当文本溢出时显示省略号 */
			white-space: nowrap;
			width: 60%;
		}

		.right-btn {
			position: absolute;
			right: 0;
			margin-right: 50rpx;
			display: flex;
			align-items: center;

			.text3 {
				font-family: 阿里巴巴普惠体 2.0;
				font-size: 13px;
				font-weight: 500;
				line-height: 13px;
				letter-spacing: 0px;
				color: #FF7681;
				margin-right: 10rpx;
			}

			image {
				width: 12px;
				height: 12px;
			}
		}
	}
}

.cbody2 {
	margin: 20rpx 0;
	padding: 20rpx 0 200rpx;
	background-color: #ffffff;

	.dynamicList {
		border-radius: 10px;
		background-color: #ffffff;
		width: 100%;
		height: 100%;
		display: flex;
		flex-direction: row;
		align-items: flex-start;
		// padding: 20rpx 0;

		.left {
			padding: 20rpx 0;
			width: 100rpx;

			.day {
				font-family: 阿里巴巴普惠体 2.0;
				font-size: 19px;
				font-weight: bold;
				line-height: 14px;
				letter-spacing: 0px;
				color: #212121;
				padding: 20rpx;
			}

			.year {

				font-family: 阿里巴巴普惠体 2.0;
				font-size: 10px;
				font-weight: normal;
				line-height: 14px;
				letter-spacing: 0px;
				color: #999999;
				padding: 0 20rpx;
			}

			image {
				width: 44px;
				height: 44px;
			}
		}

		.dian {
			width: 6px;
			height: 6px;
			opacity: 1;
			background: #A4DAA9;
			position: absolute;
			border-radius: 50%;
			left: 92rpx;
		}

		.right {
			border-left: 1px dashed #AAE1AF;
			width: 80%;
			padding: 20rpx;

			.r1 {
				display: flex;
				align-items: center;
				margin: 20rpx 0;

				.fenlei {
					min-width: 72px;
					// max-width: 100px;
					height: 24px;
					border-radius: 33px;
					opacity: 1;

					background: rgba(251, 182, 187, 0.14);
					font-size: 12px;
					font-weight: normal;
					line-height: 18px;
					letter-spacing: 0px;
					color: #F7635C;
					display: flex;
					align-items: center;
					justify-content: center;
					padding: 0 10rpx;

					.fenlei1 {
						white-space: nowrap;
						// overflow: hidden;
						// text-overflow: ellipsis;
						// -o-text-overflow: ellipsis;
					}
				}

				.status {
					display: flex;
					align-items: center;
					justify-content: center;
					position: absolute;
					right: 0;
					margin-right: 40rpx;
					padding: 0 10rpx;

					font-family: 阿里巴巴普惠体 2.0;
					font-size: 14px;
					font-weight: normal;
					line-height: 21px;
					letter-spacing: 0px;
					text-decoration: underline;
					color: #999999;
				}
			}

			.r2 {
				display: flex;
				align-items: center;
				font-size: 12px;
				font-weight: normal;
				line-height: 12px;
				letter-spacing: 0px;
				color: #999999;

				.r2-con {
					margin-left: 20rpx;
				}

				.r2-time {
					margin-right: 40rpx;
					position: absolute;
					right: 0;
				}

				.r2-sex1 {
					display: flex;
					width: 42px;
					height: 16px;
					border-radius: 88px;
					opacity: 1;
					background: rgba(116, 220, 254, 0.2);

					font-size: 11px;
					font-weight: 500;
					line-height: 15px;
					display: flex;
					align-items: center;
					justify-content: center;
					letter-spacing: 0px;
					color: #2BC1F1;

				}

				.r2-sex2 {
					display: flex;
					width: 42px;
					height: 16px;
					border-radius: 88px;
					opacity: 1;

					background: rgba(253, 168, 175, 0.2);

					font-size: 11px;
					font-weight: 500;
					line-height: 15px;
					display: flex;
					align-items: center;
					justify-content: center;
					letter-spacing: 0px;
					color: #FDA8AF;

				}
			}

			.r3 {
				display: flex;

				.tabs {
					display: flex;
					position: relative;
					margin: 15rpx 0;

					.tabs-item {
						font-family: PingFang SC;
						font-size: 12px;
						font-weight: normal;
						line-height: 18px;
						display: flex;
						align-items: center;
						justify-content: center;
						letter-spacing: 0px;
						color: #FFFFFF;
						width: 59px;
						height: 22px;
						border-radius: 20px;
						opacity: 1;
						background: #FF6C91;
						margin-right: 15rpx;

					}
				}
			}

			.r4 {
				// display: flex;
				font-size: 14px;
				font-weight: normal;
				line-height: 21px;
				letter-spacing: 0px;
				color: #333333;
				width: 295px;

				.expand-btn {
					font-size: 13px;
					font-weight: normal;
					line-height: 21px;
					letter-spacing: 0px;
					color: #FF7883;
				}
			}

			.r5 {
				display: flex;

				.image {
					display: flex;
					margin-right: 10rpx;
				}
			}

			.r6 {
				display: flex;
				align-items: center;
				width: 293px;
				height: 26px;
				border-radius: 4px;
				opacity: 1;

				background: rgba(0, 188, 86, 0.05);
				font-size: 11px;
				font-weight: normal;
				line-height: 12px;
				letter-spacing: 0px;
				margin: 10rpx 0;
				color: #00BC56;

				image {
					width: 13px;
					height: 13px;
					margin: 0 20rpx;
				}
			}

			.r7 {
				display: flex;
				align-items: center;
				width: 293px;
				height: 26px;
				border-radius: 4px;
				opacity: 1;

				background: rgba(255, 119, 43, 0.05);
				font-size: 11px;
				font-weight: normal;
				line-height: 12px;
				letter-spacing: 0px;
				margin: 10rpx 0;
				color: #FF772B;

				image {
					width: 13px;
					height: 13px;
					margin: 0 20rpx;
				}
			}

			.r9 {
				display: flex;
				align-items: center;
				width: 293px;
				height: 26px;
				border-radius: 4px;
				opacity: 1;

				font-size: 11px;
				font-weight: normal;
				line-height: 12px;
				letter-spacing: 0px;
				margin: 10rpx 0;
				color: #666666;

				image {
					width: 13px;
					height: 13px;
					margin: 0 20rpx;
					flex-shrink: 0;
				}
			}

			.r8 {
				font-size: 13px;
				font-weight: 500;
				line-height: 14px;
				letter-spacing: 0px;
				color: #333333;
				display: flex;
				justify-content: space-between;
				align-items: center;
				margin: 20rpx 0;
				width: 293px;

				.image {
					display: flex;
					align-items: center;
				}

				image {
					width: 16px;
					height: 16px;

					margin-right: 10rpx;
				}
			}
		}
	}
}

.cbody1 {
	margin: 20rpx 0;
	padding-bottom: 200rpx;

	.body {
		padding: 20rpx 30rpx;
		width: 750rpx;
		height: 87.63%;
		box-sizing: border-box;
		opacity: 1;
		margin: 20rpx 0;
		background-color: #FFFFFF;

		.title-name {
			font-family: PingFang SC;
			font-size: 16px;
			font-weight: normal;
			line-height: 18px;
			letter-spacing: 0px;
			color: #333333;
			margin-top: 20rpx;
			margin-bottom: 10rpx;
		}

		.con {
			display: flex;
			padding: 30rpx 0;
			// width: 96%;
			flex-flow: wrap;

			.tabs {
				display: flex;
				flex-wrap: wrap;

				.tabs-item {
					font-family: PingFang SC;
					font-size: 24rpx;
					font-weight: normal;
					line-height: 24rpx;
					display: flex;
					align-items: center;
					justify-content: center;
					letter-spacing: 0px;
					color: #FFFFFF;
					width: 118rpx;
					height: 44rpx;
					border-radius: 44rpx;
					opacity: 1;
					background: #FF6C91;
					margin-right: 14rpx;
					margin-bottom: 14rpx;
					padding: 10rpx;

				}
			}

			.fuwu {
				display: flex;
				flex-direction: column;
				align-items: center;
				justify-content: center;
				font-size: 24rpx;
				font-weight: normal;
				line-height: 30rpx;
				text-align: center;
				letter-spacing: 0px;
				color: #666666;
				flex-basis: 20%;
				box-sizing: border-box;
				padding: 15rpx;
				// margin-bottom: 20rpx;

				image {
					width: 90rpx;
					height: 90rpx;
				}

				view {
					margin-top: 10rpx;
					width: 100rpx;
				}
			}

			.com1 {
				width: 100%;
				box-sizing: border-box;
				// height: 190rpx;
				border-radius: 22px 22px 8px 8px;
				opacity: 1;

				background: linear-gradient(359deg, rgba(253, 215, 225, 0.5) 2%, rgba(255, 232, 236, 0.5) 97%);
				display: flex;
				align-items: center;
				justify-content: space-between;
				padding: 30rpx;

				.l1 {
					// flex: 1;
					margin-left: 40rpx;

					.score {
						font-family: PingFang SC;
						font-size: 22px;
						font-weight: normal;
						line-height: 22px;
						text-align: center;
						letter-spacing: 0px;

						color: #333333;

						/* 98 */
						font-family: PingFang SC;
						font-weight: 400;
						font-size: 32px;

					}

					.fen {
						/* 分 */
						font-family: PingFang SC;
						font-weight: 400;
						font-size: 22px;
					}
				}

				.text {
					font-family: 阿里巴巴普惠体 2.0;
					font-size: 24rpx;
					font-weight: normal;
					line-height: 24rpx;
					text-align: center;
					letter-spacing: 0px;
					color: #333333;
					margin-bottom: 20rpx;
					display: flex;
					align-items: center;
					justify-content: center;

					&:last-child {
						margin-bottom: 0;
					}
				}

				.l2 {
					margin-right: 38rpx;
				}
			}

			.com2 {
				margin: 20rpx 0;

				.tab {
					height: 32px;
					border-radius: 33px;
					opacity: 1;
					background: rgba(132, 226, 141, 0.06);
					box-sizing: border-box;
					border: 1px solid #84E28D;
					font-family: 阿里巴巴普惠体 2.0;
					font-size: 14px;
					font-weight: normal;
					line-height: 18px;
					letter-spacing: 0px;
					color: #65DE71;
					margin: 20rpx 0;
					display: flex;
					align-items: center;
					justify-content: center;
					padding: 0 20rpx;
					width: fit-content;
				}
			}
		}
	}
}

.tab {
	width: 100%;
	height: 57px;
	opacity: 1;
	background: #FFFFFF;
	display: flex;
	align-items: center;
}

.title {
	width: 100%;
	border-radius: 16px 16px 0px 0px;
	opacity: 1;
	background: #FFFFFF;
	margin-top: -30rpx;
	position: relative;

	.con5 {
		width: 680rpx;
		height: 87px;
		border-radius: 22px 8px 22px 8px;
		opacity: 1;

		background: linear-gradient(180deg, rgba(255, 190, 190, 0.48) 0%, rgba(255, 190, 190, 0) 100%);
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin: 0 30rpx;

		.l1 {
			font-family: PingFang SC;
			font-size: 19px;
			font-weight: normal;
			line-height: 14px;
			text-align: center;
			letter-spacing: 0px;
			color: #333333;
			flex: 1;
			display: flex;
			flex-direction: column;

			.text {
				font-family: 阿里巴巴普惠体 2.0;
				font-size: 12px;
				font-weight: normal;
				line-height: 14px;
				letter-spacing: 0px;
				color: #FF7C84;
				margin-top: 20rpx;
			}
		}
	}

	.con4 {
		margin: 0 30rpx 20rpx;

		.l1 {
			font-family: 阿里巴巴普惠体 2.0;
			font-size: 13px;
			font-weight: normal;
			line-height: 23px;
			letter-spacing: 0px;
			color: #666666;
		}
	}

	.con3 {
		display: flex;
		align-items: center;
		justify-content: space-between;
		margin: 0 30rpx 20rpx;

		.l1 {
			.id {
				font-family: 阿里巴巴普惠体 2.0;
				font-size: 14px;
				font-weight: 500;
				line-height: 14px;
				letter-spacing: 0px;
				color: #FF5866;
				margin: 20rpx 0;
			}

			.info {
				font-family: 阿里巴巴普惠体 2.0;
				font-size: 13px;
				font-weight: normal;
				line-height: 12px;
				letter-spacing: 0px;

				color: #333333;
				margin: 20rpx 0;

				span {
					margin-right: 15rpx;
				}
			}
		}

		.l2 {
			font-family: PingFang SC;
			font-size: 28px;
			font-weight: normal;
			line-height: 18px;
			text-align: right;
			letter-spacing: 1px;

			font-variation-settings: "opsz" auto;
			color: #FF5866;
			margin-right: 20rpx;
			position: relative;

			image {
				width: 11px;
				height: 11px;
				position: absolute;
				margin-top: -8px;
			}
		}
	}

	.con2 {
		display: flex;
		align-items: center;
		margin: 20rpx 30rpx;

		.l1 {
			width: 100%;
			font-family: PingFang SC;
			font-size: 23px;
			font-weight: normal;
			line-height: 20px;
			letter-spacing: 0px;
			color: #333333;
			display: flex;
			align-items: center;
			position: relative;

			.l1-sex1 {
				display: flex;
				width: 42px;
				height: 16px;
				border-radius: 88px;
				opacity: 1;
				background: rgba(116, 220, 254, 0.2);

				font-size: 11px;
				font-weight: 500;
				line-height: 15px;
				display: flex;
				align-items: center;
				justify-content: center;
				letter-spacing: 0px;
				color: #2BC1F1;

			}

			.l1-sex2 {
				display: flex;
				width: 42px;
				height: 16px;
				border-radius: 88px;
				opacity: 1;

				background: rgba(253, 168, 175, 0.2);

				font-size: 11px;
				font-weight: 500;
				line-height: 15px;
				display: flex;
				align-items: center;
				justify-content: center;
				letter-spacing: 0px;
				color: #FDA8AF;

			}
		}
	}

	.con1 {
		display: flex;
		align-items: center;

		.tab1 {
			margin: -80rpx 0 0 30rpx;

			.avator {
				width: 160rpx;
				height: 160rpx;
				border-radius: 50%;
				border: 1rpx solid #ffffff;
			}
		}


		.tab2 {
			display: flex;
			align-items: center;

			.tabs {
				margin: 0 6rpx;
				font-size: 12px;
				font-weight: normal;
				line-height: 14px;
				letter-spacing: 0px;
				color: #3D3D3D;
				display: flex;
				align-items: center;

				// border:1px solid red;
				.img {
					width: 12px;
					height: 12px;
					margin-right: 5rpx;
				}
			}
		}

		.juli {
			height: 17px;
			border-radius: 22px;
			opacity: 1;
			background: rgba(255, 255, 255, 0.86);
			font-size: 13px;
			font-weight: normal;
			line-height: 6px;
			letter-spacing: 0px;
			color: #00BC56;
			display: flex;
			align-items: center;
			justify-content: center;
			margin-top: -160rpx;
			position: absolute;
			margin-left: 200rpx;
			padding: 0 20rpx;
		}
	}
}

.swiper {
	height: 640rpx;

	.syimg1 {
		width: 100%;
		height: 100%;
		object-fit: contain;
	}
}

.header {
	width: 100%;
	height: auto;
	display: table;
	position: fixed;
	top: 0px;
	left: 0px;
	z-index: 10;

	.header-back {
		margin-left: 10rpx;
		height: 13px;
		line-height: 13px;
		position: absolute;
		left: 0;
		color: #FFFFFF;
	}

	.navon {
		width: 100%;
		height: auto;
		position: absolute;
		top: 0px;
		left: 0px;
		box-sizing: border-box;
		font-weight: 500;
		font-size: 36rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}

}

.bottom {
	position: fixed;
	bottom: 0;
	left: 0;
	width: 100%;
	background-color: #ffffff;
	z-index: 1;

	display: flex;
	align-items: center;

	.text {
		margin: 0 40rpx;
		width: 10%;
		height: 88rpx;
		text-align: center;
		font-family: 阿里巴巴普惠体 2.0;
		font-size: 10px;
		font-weight: normal;
		line-height: 18px;
		letter-spacing: 0px;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		color: #666666;

		image {
			width: 21px;
			height: 21px;
		}
	}

	.btn {
		font-weight: bold;
		font-size: 28rpx;
		color: #FFFFFF;
		line-height: 38rpx;
		text-align: center;
		line-height: 88rpx;
		margin: 15rpx 20rpx;
		background: #FF5866;
		border-radius: 102px;
		/*border: 1px solid #FF5866;*/
		width: 70%;
	}

	.btn.hui {
		background: #DDDDDD;
	}
}

.pop-bg {
	// width: 606rpx;
	// height: 403rpx;
	border-radius: 16rpx;
	opacity: 1;
	background: #FFFFFF;
	font-family: PingFang SC;
	font-size: 32rpx;
	font-weight: normal;
	line-height: 32rpx;
	letter-spacing: 0px;
	color: #333333;
	padding: 40rpx;

	.title {
		display: flex;
		align-items: center;
		justify-content: center;
		padding-top: 20rpx;
		font-family: 阿里巴巴普惠体 2.0;
		font-size: 32rpx;
		font-weight: 500;
		line-height: 32rpx;
		letter-spacing: 0px;

		color: #212121;
	}

	.bg {
		height: 270px;
		margin: 40rpx 0;
		overflow-y: scroll;

		.img {
			width: 335px;
			height: 97px;
			margin-bottom: 20rpx;
		}

		.bg-quan {
			display: flex;
			align-items: center;
			font-family: 阿里巴巴普惠体 2.0;
			font-size: 72px;
			font-weight: 800;
			letter-spacing: 0px;
			color: #FF204A;
			z-index: auto;
			position: relative;
			height: 194rpx;
			// width: 335px;
			margin: 20rpx auto;
			background: url('https://pw.qyang.cc/static/quan-bg.png') center no-repeat;
			background-size: 100%;

			.text {
				font-family: 阿里巴巴普惠体 2.0;
				font-size: 22rpx;
				font-weight: 600;
				line-height: 22rpx;
				color: #212121;
				text-align: center;
				width: 400rpx;
			}

			.text2 {
				font-family: 阿里巴巴普惠体 2.0;
				font-size: 24rpx;
				font-weight: normal;
				line-height: 24rpx;
				margin-top: 32rpx;
				display: block;
				letter-spacing: 0px;
				color: #666666;
			}

			.price {
				font-family: 阿里巴巴普惠体 2.0;
				font-weight: 500;
				font-size: 72rpx;
				width: 184rpx;
				text-align: center;
				white-space: nowrap;
			}

			.text1 {
				font-family: 阿里巴巴普惠体 2.0;
				font-size: 11px;
				font-weight: normal;
				line-height: 11px;
				letter-spacing: 0px;
				color: #FF5866;
			}

			.btn-img1 {
				width: 20px;
				height: 20px;
				position: absolute;
				right: 24px;
			}
		}

		.btn {
			position: absolute;
			bottom: 0;
			left: 40rpx;
			right: 40rpx;

			.confirm {
				width: 100%;
				height: 37px;
				border-radius: 102px;
				opacity: 1;
				background: #FF5866;
				border: 1px solid #FF5866;
				color: #fff;
				display: flex;
				align-items: center;
				justify-content: center;
				margin: 20rpx 0;
			}
		}
	}

	.bg-null {
		display: flex;
		flex-direction: column;
		align-items: center;
		// justify-content: center;
		margin-top: 20rpx;

		.null-img {
			margin-top: 20rpx;
			width: 268rpx;
			height: 268rpx;
		}

		.null-text {
			font-family: 阿里巴巴普惠体 2.0;
			font-size: 24rpx;
			font-weight: normal;
			line-height: 14px;
			letter-spacing: 0px;
			margin-top: 20rpx;
			color: #D1D1D6;
		}
	}

	.btn {
		// position: absolute;
		bottom: 0;
		margin: 10rpx auto;

		.confirm {
			width: 670rpx;
			height: 64rpx;
			border-radius: 64rpx;
			opacity: 1;
			background: #FF5866;
			border: 2rpx solid #FF5866;
			color: #fff;
			display: flex;
			align-items: center;
			justify-content: center;
			margin: 20rpx 0;
		}
	}
}

// .quan {
// 	width: 327px;
// 	height: 39px;
// 	border-radius: 16rpx;
// 	opacity: 1;

// 	background: #FFF3F6;

// 	box-sizing: border-box;
// 	border: 1px solid #FFB8BE;

// 	font-family: PingFang SC;
// 	font-size: 14px;
// 	font-weight: normal;
// 	line-height: 15px;
// 	letter-spacing: 0px;

// 	color: #FF7681;
// 	display: flex;
// 	align-items: center;

// 	.name {
// 		padding: 10rpx 20rpx;
// 	}

// 	.right {
// 		position: absolute;
// 		right: 0;
// 		display: flex;
// 		align-items: center;

// 		.money {
// 			margin: 20rpx;
// 		}

// 		.right-btn {

// 			margin-right: 80rpx;
// 		}
// 	}

// }

.pop-content {
	font-family: PingFang SC;
	font-size: 15px;
	font-weight: normal;
	line-height: 15px;
	// text-align: center;
	letter-spacing: 0px;
	display: flex;
	// align-items: center;
	justify-content: center;
	flex-direction: column;
	padding: 30rpx 0;
	padding-bottom: 50px;

	.con {
		margin: 20rpx 30rpx;
	}

	.con1 {
		display: flex;
		align-items: center;
		margin: 20rpx 0;
		font-family: PingFang SC;
		font-size: 14px;
		font-weight: normal;
		line-height: 15px;
		letter-spacing: 0px;

		color: #333333;

		.con1-2 {
			margin-right: 20rpx;
			display: flex;
			align-items: center;
		}

		image {
			width: 16px;
			height: 16px;
			margin-right: 20rpx;
		}
	}

	.con2 {
		display: flex;
		align-items: center;
		justify-content: space-between;
		font-family: PingFang SC;
		font-size: 14px;
		font-weight: normal;
		line-height: 15px;
		letter-spacing: 0px;
		margin: 20rpx 10rpx;
		color: #333333;

		.input {
			width: 81.19%;
			height: 34px;
			border-radius: 8px;
			opacity: 1;

			background: #F6F6F6;

		}
	}

	.con3 {
		font-family: PingFang SC;
		font-size: 14px;
		font-weight: normal;
		line-height: 15px;
		letter-spacing: 0px;
		margin: 20rpx 10rpx;
		color: #333333;

		.con3-text {
			font-family: PingFang SC;
			font-size: 14px;
			font-weight: normal;
			line-height: 15px;
			letter-spacing: 0px;
			color: #FF7681;
		}

		.con3-input {
			margin-top: 20rpx;
		}
	}

	.title {
		text-align: center;
	}

	.pop-bottom {
		width: 100%;
		height: 59px;
		opacity: 1;
		background: #FFFFFF;
		box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.1);
		font-family: PingFang SC;
		font-size: 15px;
		font-weight: normal;
		line-height: 15px;
		text-align: center;
		letter-spacing: 0px;
		display: flex;
		align-items: center;
		justify-content: center;
		position: absolute;
		bottom: 0;

		.btn1 {
			width: 133px;
			height: 40px;
			border-radius: 102px;
			opacity: 1;
			background: #F7F7F7;
			border: 1px solid #F7F7F7;
			color: #333333;
			display: flex;
			align-items: center;
			justify-content: center;
			margin: 0 40rpx;
		}

		.btn2 {
			width: 133px;
			height: 40px;
			border-radius: 102px;
			opacity: 1;
			background: #FF5866;
			border: 1px solid #FF5866;
			color: #FFFFFF;
			display: flex;
			align-items: center;
			justify-content: center;
			margin: 0 40rpx;
		}

		.btn {
			width: 80%;
			height: 70rpx;
			border-radius: 102px;
			background: #FF5866;
			border: 1px solid #FF5866;
			color: #FFFFFF;
			display: flex;
			align-items: center;
			justify-content: center;
		}
	}

	.text {
		width: 100%;
		color: #000000;
		line-height: 90rpx;
		display: flex;
		align-items: center;
		justify-content: center;
	}
}

.playIcon {
	position: absolute;
	z-index: 99;
	left: 330rpx;
	top: 280rpx;
	width: 90rpx;
	height: 90rpx;
}

.swiper {
	position: relative;

	.bannerNum {
		position: absolute;
		right: 32rpx;
		bottom: 62rpx;
		font-size: 28rpx;
		color: #999999;

		text {
			color: #333333
		}
	}
}
</style>